<template>
	<view class="container">
		
		<cart-list-header @radioChange="onListRadioChange" :selected="isListRadioSelected" />
		
		<view class="cartList">
			
			<cart-list-item 
				v-for="(item, index) in list" :key="item.cartItemId"
				:imgSrc="item.thumbnail"
				:selected="item.selected"
				:title="item.name"
				:stock="item.stock"
				:quantity="item.quantity"
				:price="(item.price / 100).toFixed(2)"
				@radioChange="onItemRadioChange(index)"
			/>
			
		</view>
		
	</view>
</template>

<script>
	import counter from '@/components/counter/counter.vue'
	import cartListHeader from '@/components/cart-list-header/cart-list-header.vue'
	import cartListItem from '@/components/cart-list-item/cart-list-item.vue'
	
	export default {
		props: ['list', 'isListRadioSelected'],
		components: {
			counter,
			cartListHeader,
			cartListItem,
		},
		data() {
			return {
				
			}
		},
		methods: {
			onClick(e){
				// console.log('点击了'+(e.position === 'left' ? '左侧' : '右侧') + e.content.text + '按钮')
				console.log('点击了')
			},
			swipeChange(e){
				console.log('当前状态', e)
			},
			onListRadioChange() {
				this.$emit('listRadioChange')
			},
			onItemRadioChange(index) {
				this.$emit('itemRadioChange', index)
			}
		}
	}
</script>

<style>
	.container {
		/* #ifdef H5 || MP-WEIXIN */
		display: flex;
		/* #endif */
		flex-direction: column;
	}
	.cartList {
		/* #ifdef H5 || MP-WEIXIN */
		display: flex;
		/* #endif */
		flex-direction: column;
	}
</style>
